<template>
    <div class="generalPageBox">
        <div class="pageContant">

            <!-- 课程详情 -->
            <div class="pageDetail">
                <div class="titleAll ">
                    <div class="public-header">
                        <div class="public-header-ch">课程详情</div>
                        <div class="public-header-en">COURSE&nbsp;&nbsp;DETAILS</div>
                        <div class="public-header-line"></div>
                    </div>
                    <img src="../../static/image/icon-title.png">
                </div>
            </div>
            <div class="meetingRom"><img src="../../static/image/meeting.png">进入大会议房间</div>

            <div :class="{'theCourseDetail':isA,'theCourseDetails':!isA}">
                <div class="theCourseDetailsLeft">
                    <h3>课程名称：{{courseName}}</h3>  
                    <div class="block">
                        <span class="classTitle">课程开始时间</span>
                        <el-date-picker class="classday" v-model="sdate" @change="validateData('sdate')" type="date" placeholder="选择日期" value-format="yyyy-MM-dd" format="yyyy-MM-dd" :disabled="allInputDisable"></el-date-picker>
                        <el-time-picker class="classtime" @change="validateData('stime')" arrow-contro value-format="HH:mm" format="HH:mm" v-model="stime" placeholder="任意时间点" :disabled="allInputDisable"></el-time-picker>
                    </div>
                    <div class="emptyBox">
                        <div class="emptyTip" v-show="startDateErr">开始日期不得为空</div>
                        <div class="emptyTip" v-show="startTimeErr">开始时间不得为空</div>                        
                    </div>
                   
                    <div class="block">
                        <span class="classTitle">课程结束时间</span>
                        <el-date-picker class="classday" v-model="edate" @change="validateData('endDate')" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="选择日期" :disabled="allInputDisable"></el-date-picker>
                        <el-time-picker class="classtime" v-model="etime" @change="validateData('endTime')" arrow-contro value-format="HH:mm" format="HH:mm" placeholder="任意时间点" :disabled="allInputDisable"></el-time-picker>
                    </div>
                    <div class="emptyBox">
                        <div class="emptyTip" v-show="endDateErr">结束日期不得为空</div>
                        <div class="emptyTip" v-show="endTimeErr">结束时间不得为空</div>                        
                    </div>
                    <h4>课程申请邀请码：{{courseApplyCode}}</h4> 
                </div>

                <div class="theCourseDetailsTwo">
                    <div class="block">
                        <span class="classTitle">课程报名开始时间</span>
                        <el-date-picker class="classday" v-model="apsdate" @change="validateData('apsDate')" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="选择日期" :disabled="allInputDisable"></el-date-picker>
                        <el-time-picker class="classtime" v-model="apstime" @change="validateData('apsTime')" arrow-contro value-format="HH:mm" format="HH:mm" placeholder="任意时间点" :disabled="allInputDisable"></el-time-picker>
                    </div>
                    <div class="emptyBox">
                        <div class="emptyTip" v-show="apsDateErr">开始日期不得为空</div>
                        <div class="emptyTip" v-show="apsTimeErr">时间不得为空</div>                        
                    </div>
                    <div class="block">
                        <span class="classTitle">课程报名结束时间</span>
                        <el-date-picker class="classday" v-model="apedate" @change="validateData('apeDate')" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="选择日期" :disabled="allInputDisable"></el-date-picker>
                        <el-time-picker class="classtime" v-model="apetime" @change="validateData('apeTime')" arrow-contro value-format="HH:mm" format="HH:mm" placeholder="任意时间点" :disabled="allInputDisable"></el-time-picker>
                    </div>
                    <div class="emptyBox">
                        <div class="emptyTip" v-show="apeDateErr">开始时间不得为空</div>
                        <div class="emptyTip" v-show="apeTimeErr">日期不得为空</div>                        
                    </div>
                </div>

                <div class="theCourseDetailsCen">   
                    <!-- <div>
                        <el-checkbox label="自动运行 时间间隔" name="type" 
                                     :checked="runningshow" 
                                     @change="runningshow=!runningshow" >
                        </el-checkbox>
                        <el-input v-model="autoRunTime" :disabled="!runningshow"></el-input>
                        <div class="emptyTip" v-show="autoRunTimeErr">时间不得为空</div>
                    </div> -->
                    <div class="free">
                        <el-checkbox label="自动运行" name="type" 
                            v-model="runningshow"
                            @click="runningshow=!runningshow" >
                        </el-checkbox>
                        <el-input v-model="autoRunTime" @change="validateData('autoRunTimes')" :disabled="!runningshow"></el-input>
                        <!-- <el-time-picker v-model="autoRunTime" arrow-contro value-format="HH:mm" format="HH:mm" :picker-options="{selectableRange: '18:30:00 - 20:30:00'}" placeholder="选择时间" :disabled="allInputDisable"></el-time-picker> -->
                        <!-- <el-checkbox v-model="checked" v-on:change="toggle()">自动运行<el-time-picker arrow-contro value-format="HH:mm" format="HH:mm" v-model="value3" :picker-options="{selectableRange: '18:30:00 - 20:30:00'}" placeholder="选择时间" :disabled="allInputDisable"></el-time-picker>
                        </el-checkbox>  -->
                        <div class="emptyBox">
                            <div class="emptyTip" v-show="autoRunTimeErr">时间不得为空</div>
                        </div>
                    </div>

                    <div v-show="runningshow" class="freetime">
                        <div class="block" v-for="(list,index) in courseRoundModels" :key="index">
                            <div class="timeLine">
                                <label class="classTitle"><i class="red">*</i>第{{index+1}}轮</label>
                                <el-date-picker class="classday" v-model="list.starDate" @change="validateData('')" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="选择日期" :disabled="allInputDisable"></el-date-picker>                    
                                 <el-time-picker  
                                    class="classtime" arrow-contro v-model="list.startTime" value-format="HH:mm" format="HH:mm"
                                    placeholder="任意时间" @change="validateData('')" :disabled="allInputDisable">
                                </el-time-picker>
                            </div>   
                            <div class="emptyBox">
                                <div class="emptyTip" v-show="roundDateErr">日期不得为空</div>
                                <div class="emptyTip" v-show="roundTimeErr">时间不得为空</div>
                            </div>                                                  
                        </div>
                    </div>

                    <div class="theCourseright">
                        <div class="courseBtn">
                            <router-link to="home" class="bntc"><img src="../../static/image/icon-eye.png">课程后台</router-link>
                            <el-button class="bntc" v-if="boxchooseType=='1'" @click="boxchoose(1)" ><img src="../../static/image/icon-edit.png" alt="">编辑详情</el-button>
                            <el-button class="bntc" v-else @click="boxchoose(2)" :disabled="hasError"><img src="../../static/image/icon-edit.png">保存</el-button>
                        </div>
                    </div>
                </div>
                
            </div>


            <!-- 队伍列表 -->
            <div class="teamlist">
                <div class="public-header">
                    <p class="public-header-ch">队伍列表</p>
                    <p class="public-header-en">
                        <span class="pageSub">TEAM&nbsp;&nbsp; MEMBER</span>
                    </p>
                    <p class="public-header-line"></p>
                </div>
                <div class="invite">
                    <p>发起邀请</p>
                     <div class="handle">
                        <el-button v-if="changeBtn" @click="editchangeBtn()">更换组别</el-button>
                        <el-button v-if="!changeBtn" @click="editchangeBtn()">保存更换</el-button>
                        <el-button v-if="editOrSaveBtnShow" @click="editOrSaveHandler()" ><img src="../../static/image/icon-edit.png">编辑详情</el-button>
                        <el-button v-if="!editOrSaveBtnShow" @click="editOrSaveHandler()" :disabled="teamhasError" ><img src="../../static/image/icon-edit.png">保存</el-button>
                        <!-- <span v-if="editOrSaveBtnShow" @click="editOrSaveHandler()" ><img src="../../static/image/icon-edit.png">编辑详情</span>
                        <span v-if="!editOrSaveBtnShow" @click="editOrSaveHandler()" ><img src="../../static/image/icon-edit.png">保存</span> -->
                    </div>
                </div>
                <div :class="{'pageMemberAll':isB,'pageMemberAlls':!isB}">
                   
                    <div class="pageMember" 
                         v-for="(member,index) in memberAll" :key="index"
                         :data-id="member.teamId"
                    >
                        <div class="memberTitle">
                            <i>{{member.teamName}}</i>                 
                            <a :href="member.joinUrl"><img src="../../static/image/meeting.png">进入大会议房间</a>
                            <span :class="{'shows':isAdd,'hide':!isAdd}">添加学员</span>
                        </div>
                        <div class="teamCenter">
                            <table class="teamTable">
                                <thead>
                                    <tr>
                                        <th></th>
                                        <th>姓名</th>
                                        <th>手机号</th>
                                        <th>性别</th>
                                        <th>子公司/部门</th>
                                        <th>职位</th>
                                        <th></th>
                                    </tr>   
                                </thead>
                                <tbody>
                                    <tr class="memberTr" v-for="(memberList,cindex) in member.teamMembersInfoList" :key="cindex">
                                        <td>学员{{cindex+1}}</td>
                                        <td><input class="isReadOnly" type="text" v-model="memberList.name" :data-id="memberList.id" :data-uname="memberList.age" disabled="true"></td>
                                        <td>
                                            <!-- <input class="isReadOnly" type="text" v-model="memberList.mobile" @change="blurValidator(memberList.mobile,modalContentData,$event)" disabled="true"> -->
                                            <input class="isReadOnly" type="text" v-model="memberList.mobile" @blur="blurValidator(memberList.mobile)" disabled="true">
                                            <div class="emptyTip3" v-show="memberList.errorinputtext">{{memberList.errorText}}</div>
                                            <!-- <input class="isReadOnly" type="text" v-model="memberList.mobile" @change="blurValidator(memberList.mobile)" disabled="true">
                                            <div class="emptyTip3"></div> -->
                                        </td>
                                        <td>
                                            <select class="isReadOnly" v-model="memberList.gender" disabled="true">
                                                <!-- <option :value="memberList.gender">{{memberList.gender}}</option> -->
                                                <option label="男" value="男"></option>
                                                <option label="女" value="女"></option>
                                            </select>
                                        </td>
                                        <td><input class="isReadOnly" type="text" v-model="memberList.companyName" disabled="true"></td>
                                        <td>
                                            <!-- <select v-model="memberList.position" :disabled="inhibiting">
                                                <option v-for="post in positionAll" :value="post.id" :key="post.id">{{ post.positionName }}</option>
                                            </select> -->
                                            <!-- <el-form-item label="职位" prop="position" class="form-position"> -->
                                                <select class="isReadOnly" v-model="memberList.position" disabled="true">
                                                    <option class='form-default' value="0" disabled selected hidden></option>
                                                    <option v-for="post in positionAll" v-bind:value="post.id" :key="post.id">{{ post.positionName }}</option>
                                                </select>
                                            <!-- </el-form-item> -->

                                        </td>
                                        <!-- <td><input type="text" v-model="memberList.post" ></td> -->
                                        <td @click="clickinformatin(index,cindex)"><img src="../../static/image/clear.png"></td>
                                    </tr>
                                </tbody>
                            </table>

                        </div>
                        
                    </div>

                </div>
            </div>

        </div>               

    </div>
</template>


<script>
  export default {
    data() {

        return {
            // 编辑或保存按钮显示/隐藏
            editOrSaveBtnShow: true,
            //更换组别/保存更换
            changeBtn:true,

            inhibiting: true,

            // 课程名称
            courseName:'', 
            //课程邀请码
            courseApplyCode:'',
            // 课程开始日期
            sdate:'',
            // 课程开始时间
            stime:'',
            // 课程开始日期和时间
            startTime:'',
            // 课程结束日期
            edate:'',
            // 课程结束时间
            etime:'',
            // 课程结束日期和时间 
            endTime:'',
            // 课程报名开始日期
            apsdate:'',
            // 课程报名开始时间
            apstime:'',
            // 课程报名开始日期和时间
            applyStartTime:'',
            // 课程报名结束日期
            apedate:'',
            // 课程报名结束时间
            apetime:'',
            // 课程报名结束日期和时间
            applyEndTime:'',
            // 
            // 自动运行是否被选中
            checked:'',
            // 是否自动运行 0 不自动运行 1自动运行
            autoRun: 0,
            // 自动运行时间间隔
            autoRunTime: "",
            // 自动运行数组
            courseRoundModels:[
                // {
                //     roundNum: 1,
                //     starDate: "",
                //     startTime: ""
                // }
                
            ],
            // 自动运行显示
            runningshow:false,
            // 临时运行轮数数组
            courseRoundboxs:[],
            // //队伍列表是否可编辑
            // inhibiting:false,
            /*
            *课程详情判断是否可以编辑
            1-是不可编辑
            2-是可以编辑
             */
            boxchooseType:'1',
            //进入页面时课程详情是否可以编辑（true时不可编辑）
            isA:true,
            //进入页面时队伍列表是否可以编辑（true时不可编辑）
            isB:true,
            //添加学员显示（）
            isAdd:false,

            //自动运行的错误提示           
            startDateErr:false,
            startTimeErr:false,
            endDateErr:false,
            endTimeErr:false,
            apsDateErr:false,
            apsTimeErr:false,     
            apeDateErr:false,
            apeTimeErr:false,  
            autoRunTimeErr:false,
            roundDateErr:false,
            roundTimeErr:false,     
            testdate:'',      
            //课程详情的保存按钮是否可按
            hasError:false,
            //队伍列表的保存按钮是否可按 
            teamhasError:false,

            // //队伍列表
            // compileType:'1',

            pickerOptions1: {
                disabledDate(time) {
                    return time.getTime() > Date.now();
                },
            
            },
            //队伍报错
            errorinputtext:false,
            //队伍列表
            memberAll:[
                {
                    teamMembersInfoList:[]
                },
                                
            ],
            positionAll:[]


        };
    },
    computed:{
        // 判断课程详情是显示编辑还是保存
        "allInputDisable":function(){
            if(this.boxchooseType==1){
                return true
            }
            return false
        },

        // // 判断队伍列表是显示编辑还是保存
        // "inhibiting":function(){
        //     if(this.compileType==1){
        //         //alert(34)               
        //         return true //编辑详情
        //     }
        //      //alert(90)
        //      return false //保存按钮
        // }

    },
    methods:{

        teamnumber:function(){
            // 根据队伍数生成队伍 默认6组
            let teamsNumber = 6;
            let data = {};
            this.memberAll = []; // 初始化
            this.itemNum = 65; // 初始化
            for (let index = 0; index < teamsNumber; index++) {
                data = {
                    teamName:"队伍"+String.fromCharCode(this.itemNum),
                    teamMembersInfoList:[]
                };
                for (let j = 0;j < 10; j++) {
                    let data2 = {
                        // studentNum: '学员'+(j+1),
                        name: '',
                        mobile: '',
                        gender: '',
                        companyName:'',
                        position:0
                    }
                    data.teamMembersInfoList.push(data2)
                }
                this.memberAll.push(data)
                this.itemNum++
            }
        },
        //点击删除 清空信息
        clickinformatin:function(teamIndex,memberIndex){
            console.log(teamIndex, memberIndex)
            this.memberAll[teamIndex].teamMembersInfoList[memberIndex].name = '';
            this.memberAll[teamIndex].teamMembersInfoList[memberIndex].mobile = '';
            this.memberAll[teamIndex].teamMembersInfoList[memberIndex].gender = '';
            this.memberAll[teamIndex].teamMembersInfoList[memberIndex].companyName = '';
            this.memberAll[teamIndex].teamMembersInfoList[memberIndex].position = '';

            let inputParent = document.getElementsByClassName('pageMember')
            let inputParentTr = inputParent[teamIndex].getElementsByClassName('memberTr')
            let isReadOnlyInput = inputParentTr[memberIndex].getElementsByClassName('isReadOnly');

            for (const key in isReadOnlyInput) {
                const element = isReadOnlyInput[key]
                if (element.nodeType == 1) {
                    element.removeAttribute('disabled')
                    element.classList.remove('border-none')
                }
            }
        },

        /*
         *课程详情
         * case 1为编辑，case2 为何保存
         */
        boxchoose:function(type){
            this.isA=!this.isA 
            switch(type){
                case 1:
                this.boxchooseType=2;

                //清空时间课程详情
                // let nulltimes = this.courseRoundModels;
                // console.log(456456)
                // console.log(this.courseRoundModels);
                // for (const once in nulltimes) {
                //     if (nulltimes.hasOwnProperty(once)) {
                //         const element = nulltimes[once];
                //         this.courseRoundModels[once].starDate = ''
                //         this.courseRoundModels[once].startTime = ''
                //     }
                // }

                break;
                case 2:
                this.boxchooseType=1;
                //点击课程详情保存

                //课程开始时间为空判断
                if(type == 'sdate'){ 
                    //debugger
                    if(this.sdate == '' || this.sdate == null){
                        this.startDateErr = true;
                    }else{
                        this.startDateErr = false;
                    }
                };
                if(type == 'stime'){
                    if(this.stime=='' || this.stime== null ){
                        this.startTimeErr = true;
                    }else{
                        this.startTimeErr = false;
                    }
                };
                //课程结束时间为空判断
                if(type == 'endDate'){ 
                    if(this.edate == '' || this.edate == null){
                        this.endDateErr = true;
                    }else{
                        this.endDateErr = false;
                    }
                };
                if(type == 'endTime'){
                    if(this.etime =='' || this.etime == null){
                        this.endTimeErr = true;
                    }else{
                        this.endTimeErr = false;
                    }
                };
                //课程报名开始时间为空判断
                if(type == 'apsDate'){ 
                    if(this.apsdate == '' || this.apsdate == null){
                        this.apsDateErr = true;
                    }else{
                        this.apsDateErr = false;
                    }
                };
                if(type == 'apsTime'){
                    if(this.apstime =='' || this.apstime == null){
                        this.apsTimeErr = true;
                    }else{
                        this.apsTimeErr = false;
                    }
                };
                //课程报名结束时间为空判断
                if(type == 'apeDate'){ 
                    if(this.apedate == '' || this.apedate == null){
                        this.apeDateErr = true;
                    }else{
                        this.apeDateErr = false;
                    }
                };
                if(type == 'apeTime'){
                    if(this.apetime =='' || this.apetime == null){
                        this.apeTimeErr = true;
                    }else{
                        this.apeTimeErr = false;
                    }
                };
                //自动运行时间
                if(type == 'autoRunTimes'){
                    if(this.autoRunTime ==''|| this.autoRunTime ==null){
                        this.autoRunTimeErr = true
                    }else{
                        this.autoRunTimeErr = false
                    }
                };
                // //轮数时间为空判断
                // if(type == 'startroundDate'){              
                //     if(this.startDate == '' || this.startDate == null){
                //         // alert(123)
                //         // return
                //         alert(111)
                //         this.roundDateErr = true
                //     }else{
                //         alert(22)
                //         this.roundDateErr = false
                //     }
                // };
                // if(type == 'startroundTime'){
                //     if(this.startTime == '' || this.startTime == null){
                //         alert(1212)
                //         this.roundTimeErr = true
                //     }else{
                //          alert(2121)
                //         this.roundTimeErr = false
                //     }
                // }

                //禁止下一步按钮点击
                if (this.startDateErr === false && this.startTimeErr === false && this.endDateErr === false && this.endTimeErr === false && this.apsDateErr === false && this.apsTimeErr === false && this.apeDateErr === false && this.apeTimeErr === false ) {
                    this.hasError = false;
                } else {
                    this.hasError = true;
                }

                //自动运行的checkbox
                let autoRunnum ;
                if(this.runningshow == false){
                    // this.runningshow = false
                    autoRunnum = 0
                }else{
                    autoRunnum = 1
                    // this.runningshow = true
                };
                
                let times = [];
                for (const key in this.courseRoundModels) {
                    if (this.courseRoundModels.hasOwnProperty(key)) {
                        const element = this.courseRoundModels[key];
                        let data = {
                            id: element.id,
                            courseId:element.courseId,
                            startTime: element.starDate + ' ' + element.startTime,
                            roundNum: element.roundNum,
                            createTime: ''
                        }
                        times.push(data)
                    }
                }
  
                let data={
                    id:this.$route.params.id,
                    courseName:this.courseName,
                    startTime:this.sdate +' '+ this.stime,
                    endTime:this.edate +' '+this.etime,
                    applyStartTime:this.apsdate +' '+this.apstime,
                    applyEndTime:this.apedate +' '+this.apetime,
                    courseApplyCode:this.courseApplyCode,
                    courseRoundModelList:times,
                    autoRun:autoRunnum,
                    // autoRunTime:this.autoRunTime,  //因为   autoRunTime传来的数值为null
                    autoRunTime:'', //暂时数值
                    roundNumber:'',  
                    joinUrl:'',                   
                   
                    roundNumber:"",
                }
                this.$http.editInvitecourseDetails(data,(res)=>{
                    console.log(res)
                },(errorRes)=>{
                    console.log(errorRes)
                });
                break;
            }
            this.flag=false
        // this.isReadOnly = true;
        },

        // 课程详情显示隐藏
        toggle:function(){
            this.isShow = !this.isShow;
        },

        //手机号失去焦点
        blurValidator:function(mobile){
            
            /******** 手机格式验证 start ********/
            let reg = /^[1][3,4,5,7,8][0-9]{9}$/; //格式正则表达式
            let count = 0;
            for(let i in this.memberAll){
                for (let j in this.memberAll[i].teamMembersInfoList){
                    if (this.memberAll[i].teamMembersInfoList[j].mobile != '') {
                        // 验证手机格式
                        if (!reg.test(this.memberAll[i].teamMembersInfoList[j].mobile)) {
                            this.memberAll[i].teamMembersInfoList[j].errorinputtext=true
                            this.memberAll[i].teamMembersInfoList[j].errorText="号码格式错误" 
                            let data = {
                                mobile:this.memberAll[i].teamMembersInfoList[j].mobile
                                // teamIndex:i,
                                // memberIndex:j,
                                // errorText:'手机号码格式错误'
                            };
                            positionArr.push(data)
                            teamhasError=false
                        }
                        else{                            
                            this.memberAll[i].teamMembersInfoList[j].errorinputtext=false
                            teamhasError=true
                        }

                        
                        
                    }
                }
            }
            /******** 手机格式验证 end ********/

            // console.log(positionArr)
            // // 四层循环，外两层用来和内两层比较是否相同
            //     for(let a in this.memberAll){
            //         for (let b in this.memberAll[a].teamMembersInfoList){
            //             if (this.memberAll[a].teamMembersInfoList[b].mobile != '') {
            //                 // 错误数
            //                 let count = 0;
            //                 alert(123456)
            //                 // 运行到这里时，这是是把所有有值的手机号找出来，和外层有值的手机号比较，如果存在相同且大于等于2，则视为重复
            //                 for(let c in this.memberAll){
            //                     for (let d in this.memberAll[c].teamMembersInfoList){
            //                         if (this.memberAll[c].teamMembersInfoList[d].mobile != '') {
            //                             if (this.memberAll[a].teamMembersInfoList[b].mobile == this.memberAll[c].teamMembersInfoList[d].mobile) {
            //                                 count++;
            //                             }
            //                         }
            //                     }
            //                 }
            //                 // 大于等于2，说明存在重复
            //                 if (count >= 2) {
            //                     // 这里用一个对象存储队伍索引和成员索引，可以理解为某个队伍某行成员的某个错误
            //                     alert(45648)
            //                     this.memberAll[i].teamMembersInfoList[j].errorinputtext=true
            //                     this.memberAll[i].teamMembersInfoList[j].errorText="手机号码重复"  
            //                     // let data = {
            //                     //     teamIndex:a,
            //                     //     memberIndex:b,
            //                     //     errorText:'手机号码重复'
            //                     // };
            //                     // positionArr.push(data)
            //                 }
            //             }
            //         }
            //     }
        },


        //获取职位
        getposit:function(){
            this.$http.getPosition(null,(res)=>{
                console.log(res)
                this.positionAll = res.data
            },(erreoRes)=>{
                console.log(erreoRes)
            });
        },

        // 获取课程详情接口
        getCourseDetails:function(){
            let data = {
                // id : 1
                id: this.$route.params.id
            }
            // console.log(data);
            this.$http.inviteCourseDetails(data,(res)=>{
                this.courseName = res.data.courseName;
                this.courseApplyCode = res.data.courseApplyCode; //邀请码
                this.sdate = res.data.startTime.split(" ")[0]; //课程开始日期
                this.stime = res.data.startTime.split(" ")[1]; //课程开始时间
                this.edate = res.data.endTime.split(" ")[0];   //课程结束日期
                this.etime = res.data.endTime.split(" ")[1];  //课程结束时间
                this.apsdate = res.data.applyStartTime.split(" ")[0]; //课程报名开始日期
                this.apstime = res.data.applyStartTime.split(" ")[1]; //课程报名开始时间
                this.apedate = res.data.applyEndTime.split(" ")[0]; //课程报名结束日期
                this.apetime = res.data.applyEndTime.split(" ")[1]; //课程报名结束时间
                this.autoRunTime = res.data.createTime; //自动运行时间

                console.log(res.data.autoRun)
                //自动运行的checkbox
                if(res.data.autoRun == 0){
                    this.runningshow = false
                }else{
                    this.runningshow = true
                };
                this.autoRunTime = res.data.autoRunTime;
                this.courseRoundModels = res.data.courseRoundModelList
                let tmp = res.data.courseRoundModelList
                console.log(tmp);
                for (const key in tmp) {
                    if (tmp.hasOwnProperty(key)) {
                        const element = tmp[key];
                        this.courseRoundModels[key].starDate = element.startTime.split(' ')[0]
                        this.courseRoundModels[key].startTime = element.startTime.split(' ')[1]
                    }
                }
                console.log(res)
            },(errorRes)=>{
                consol.log(errorRes)
            })
        },

        // 学员查看展示接口
        teamlistShow:function(){
            let data={
                // id: 1 //暂用（审查数据）
                id: this.$route.params.id
            }
            this.$http.lookMembers(data,(res)=>{
                console.log(res)
                //this.memberAll = res.data
                for (const i in res.data) {
                    const teamObj = res.data[i]
                    this.memberAll[i].teamName = teamObj.teamName;
                    this.memberAll[i].teamId = teamObj.teamId;
                    this.memberAll[i].joinUrl = "";
                   
                    for (const j in teamObj.teamMembersInfoList) {
                        const memberObj = teamObj.teamMembersInfoList[j]
                        this.memberAll[i].teamMembersInfoList[j].name = memberObj.name;
                        this.memberAll[i].teamMembersInfoList[j].mobile = memberObj.mobile;
                        this.memberAll[i].teamMembersInfoList[j].gender = memberObj.gender;
                        this.memberAll[i].teamMembersInfoList[j].companyName = memberObj.companyName;
                        this.memberAll[i].teamMembersInfoList[j].position = memberObj.position; 
                        this.memberAll[i].teamMembersInfoList[j].age = memberObj.age;
                        this.memberAll[i].teamMembersInfoList[j].id = memberObj.id;
                        this.memberAll[i].teamMembersInfoList[j].positionName = memberObj.positionName;
                       
                    }
                }
                console.log(res)
            },(errorRes)=>{
                console.log(errorRes);
            })
        },


        //创建课程失去焦点
        validateData:function(type){
            
            //课程开始时间为空判断
            if(type == 'sdate'){ 
                //debugger
                if(this.sdate == '' || this.sdate == null){
                    this.startDateErr = true;
                }else{
                    this.startDateErr = false;
                }
            };
            if(type == 'stime'){
                if(this.stime=='' || this.stime== null ){
                    this.startTimeErr = true;
                }else{
                    this.startTimeErr = false;
                }
            };
            //课程结束时间为空判断
            if(type == 'endDate'){ 
                if(this.edate == '' || this.edate == null){
                    this.endDateErr = true;
                }else{
                    this.endDateErr = false;
                }
            };
            if(type == 'endTime'){
                if(this.etime =='' || this.etime == null){
                    this.endTimeErr = true;
                }else{
                    this.endTimeErr = false;
                }
            };
            //课程报名开始时间为空判断
            if(type == 'apsDate'){ 
                if(this.apsdate == '' || this.apsdate == null){
                    this.apsDateErr = true;
                }else{
                    this.apsDateErr = false;
                }
            };
            if(type == 'apsTime'){
                if(this.apstime =='' || this.apstime == null){
                    this.apsTimeErr = true;
                }else{
                    this.apsTimeErr = false;
                }
            };
            //课程报名结束时间为空判断
            if(type == 'apeDate'){ 
                if(this.apedate == '' || this.apedate == null){
                    this.apeDateErr = true;
                }else{
                    this.apeDateErr = false;
                }
            };
            if(type == 'apeTime'){
                if(this.apetime =='' || this.apetime == null){
                    this.apeTimeErr = true;
                }else{
                    this.apeTimeErr = false;
                }
            };
            //自动运行时间
            if(type == 'autoRunTimes'){
                if(this.autoRunTime ==''|| this.autoRunTime ==null){
                    this.autoRunTimeErr = true
                }else{
                    this.autoRunTimeErr = false
                }
            };
            // //轮数时间为空判断
            // if(type == 'startroundDate'){              
            //     if(this.startDate == '' || this.startDate == null){
            //         // alert(123)
            //         // return
            //         alert(111)
            //         this.roundDateErr = true
            //     }else{
            //         alert(22)
            //         this.roundDateErr = false
            //     }
            // };
            // if(type == 'startroundTime'){
            //     if(this.startTime == '' || this.startTime == null){
            //         alert(1212)
            //         this.roundTimeErr = true
            //     }else{
            //          alert(2121)
            //         this.roundTimeErr = false
            //     }
            // }

            //禁止下一步按钮点击
            if (this.startDateErr === false && this.startTimeErr === false && this.endDateErr === false && this.endTimeErr === false && this.apsDateErr === false && this.apsTimeErr === false && this.apeDateErr === false && this.apeTimeErr === false ) {
                this.hasError = false;
            } else {
                this.hasError = true;
            }

        },
        

        //更换组别/保存组别
        editchangeBtn(){
            this.changeBtn = !this.changeBtn
        },
        

        // 队伍编辑或保存处理
        editOrSaveHandler(){
            this.editOrSaveBtnShow = !this.editOrSaveBtnShow
            // 点击编辑按钮（保存按钮显示）
            if (this.editOrSaveBtnShow === false) {
                this.isB = false
                this.isAdd = true
                let inputParent = document.getElementsByClassName('pageMember')
                for (const teamIndex in this.memberAll) {
                    const teamObj = this.memberAll[teamIndex]
                    let inputParentTr = inputParent[teamIndex].getElementsByClassName('memberTr')
                    for (const memberIndex in teamObj.teamMembersInfoList) {
                        const memberObj = teamObj.teamMembersInfoList[memberIndex]
                        if (memberObj.name == '' && memberObj.mobile == '' && memberObj.gender == '' && memberObj.companyName == '' && memberObj.position == '') {
                            let isReadOnlyInput = inputParentTr[memberIndex].getElementsByClassName('isReadOnly');
                            for (const key in isReadOnlyInput) {
                                const element = isReadOnlyInput[key]
                                if (element.nodeType == 1) {
                                    element.removeAttribute('disabled')
                                }
                            }
                        } else {
                            let isReadOnlyInput = inputParentTr[memberIndex].getElementsByClassName('isReadOnly');
                            for (const key in isReadOnlyInput) {
                                const element = isReadOnlyInput[key]
                                if (element.nodeType == 1) {
                                    element.setAttribute('disabled', true)
                                    element.classList.add('border-none')
                                }
                            }
                        }
                    }
                }
            } else {
               //点击保存按钮
                this.isB = true
                this.isAdd = false                
                let isReadOnlyInput = document.getElementsByClassName('isReadOnly');
                //禁止编辑               
                for (const key in isReadOnlyInput) {
                    const element = isReadOnlyInput[key]
                    if (element.nodeType == 1) {
                        element.setAttribute('disabled', true)
                    }
                }

                /******** 手机格式验证 start ********/
                let reg = /^[1][3,4,5,7,8][0-9]{9}$/; //格式正则表达式
                let count = 0;
                for(let i in this.memberAll){
                    for (let j in this.memberAll[i].teamMembersInfoList){
                        if (this.memberAll[i].teamMembersInfoList[j].mobile != '') {
                            // 验证手机格式
                            if (!reg.test(this.memberAll[i].teamMembersInfoList[j].mobile)) {
                                this.memberAll[i].teamMembersInfoList[j].errorinputtext=true
                                this.memberAll[i].teamMembersInfoList[j].errorText="号码格式错误" 
                                let data = {
                                    mobile:this.memberAll[i].teamMembersInfoList[j].mobile
                                    // teamIndex:i,
                                    // memberIndex:j,
                                    // errorText:'手机号码格式错误'
                                };
                                positionArr.push(data)
                            }
                            else{
                                this.memberAll[i].teamMembersInfoList[j].errorinputtext=false
                            }                            
                            
                        }
                    }
                }
                /******** 手机格式验证 end ********/

                
                
                //判断非空传回 接口             
                let teams = []
                let data={
                    courseId:this.$route.params.id,
                    adminTeamMembersList:[],
                }
                for(const i in this.memberAll){
                    const teamobj = this.memberAll[i]
                        let data2 = {
                            teamId:teamobj.teamId,
                            teamName:teamobj.teamName,
                            joinUrl:teamobj.joinUrl,
                            teamMembersInfoList:[]
                        }
                    for(const j in teamobj.teamMembersInfoList){
                        const memberobj =  teamobj.teamMembersInfoList[j]
                        if(memberobj.mobile =='' || memberobj.name =='' || memberobj.gender ==''|| memberobj.position =='' || memberobj.companyName ==''){                      
                            break
                        }else{
                             let data3 = {
                                id:memberobj.id,
                                mobile:memberobj.mobile,
                                name:memberobj.name,
                                gender:memberobj.gender,
                                position:memberobj.position,
                                positionName:memberobj.positionName,
                                age:memberobj.age,
                                companyName:memberobj.companyName,
                            }
                            data2.teamMembersInfoList.push(data3)
                        }
                    }    
                    if (data2.teamMembersInfoList.length > 0) {
                        data.adminTeamMembersList.push(data2)   
                    }                 
                }
                                
                console.log(this.$route.params.id)
                console.log(this.companyName)
                this.$http.editTeam(data,(res)=>{
                    console.log(res)
                },(errorRes)=>{
                    console.log(errorRes)
                });  
            }
        },


    },
    mounted(){
        this.teamnumber(); //队伍列表数
        this.getCourseDetails();// 获取课程详情接口
        this.teamlistShow();// 学员查看展示接口
        this.getposit(); //获取职位接口
    }

    

  };
</script>



